
        @font-face {
            font-family: 'Open Sans';
            font-style: normal;
            font-weight: 400;
            src: local("Open Sans Regular"), local("OpenSans-Regular"), url("/assets/font/open-sans/open-sans-v15-latin-regular.woff2") format("woff2"), url("/assets/font/open-sans/open-sans-v15-latin-regular.woff") format("woff")
        }

        @font-face {
            font-family: 'Open Sans';
            font-style: normal;
            font-weight: 600;
            src: local("Open Sans SemiBold"), local("OpenSans-SemiBold"), url("/assets/font/open-sans/open-sans-v15-latin-600.woff2") format("woff2"), url("/assets/font/open-sans/open-sans-v15-latin-600.woff") format("woff")
        }

        @font-face {
            font-family: 'Open Sans';
            font-style: normal;
            font-weight: 700;
            src: local("Open Sans Bold"), local("OpenSans-Bold"), url("/assets/font/open-sans/open-sans-v15-latin-700.woff2") format("woff2"), url("/assets/font/open-sans/open-sans-v15-latin-700.woff") format("woff")
        }

        @font-face {
            font-family: 'Kanit';
            font-style: normal;
            font-weight: 300;
            src: local("Kanit Light"), local("Kanit-Light"), url("/assets/font/kanit/kanit-v3-latin-300.woff2") format("woff2"), url("/assets/font/kanit/kanit-v3-latin-300.woff") format("woff")
        }

        @font-face {
            font-family: 'Kanit';
            font-style: normal;
            font-weight: 600;
            src: local("Kanit SemiBold"), local("Kanit-SemiBold"), url("/assets/font/kanit/kanit-v3-latin-600.woff2") format("woff2"), url("/assets/font/kanit/kanit-v3-latin-600.woff") format("woff")
        }

        @font-face {
            font-family: 'Kanit';
            font-style: normal;
            font-weight: 700;
            src: local("Kanit Bold"), local("Kanit-Bold"), url("/assets/font/kanit/kanit-v3-latin-700.woff2") format("woff2"), url("/assets/font/kanit/kanit-v3-latin-700.woff") format("woff");
            font-display: block
        }

        @font-face {
            font-family: 'fontello';
            src: url("/assets/font/icons/fontello.eot?52988341");
            src: url("/assets/font/icons/fontello.eot?52988341#iefix") format("embedded-opentype"), url("/assets/font/icons/fontello.woff2?52988341") format("woff2"), url("/assets/font/icons/fontello.woff?52988341") format("woff"), url("/assets/font/icons/fontello.ttf?52988341") format("truetype"), url("/assets/font/icons/fontello.svg?52988341#fontello") format("svg");
            font-weight: normal;
            font-style: normal
        }

        .Gradient_Fill_1 {
            background-image: -moz-linear-gradient(45deg, #e00817 47%, #eb441d 70%, #fc0 100%);
            background-image: -webkit-linear-gradient(45deg, #e00817 47%, #eb441d 70%, #fc0 100%);
            background-image: -ms-linear-gradient(45deg, #e00817 40%, #eb441d 60%, #fc0 80%);
            position: absolute;
            left: 2457px;
            top: 466px;
            width: 1366px;
            height: 191px;
            z-index: 847
        }

        *,
        *:before,
        *:after {
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box
        }

        html {
            line-height: 1.15;
            -ms-text-size-adjust: 100%;
            -webkit-text-size-adjust: 100%;
            font-size: 1em
        }

        body {
            margin: 0;
            padding: 0;
            font-family: 'Open Sans', sans-serif;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            font-smoothing: antialiased;
            text-rendering: optimizeLegibility;
            color: #333;
            padding-top: 85px
        }

        @media screen and (min-width: 768px) {
            body {
                padding-top: 115px
            }
        }

        @media screen and (min-width: 1200px) {
            body {
                padding-top: 0px
            }
        }

        ul {
            list-style: none;
            padding: 0;
            margin: 0
        }

        a {
            color: inherit;
            text-decoration: none;
            transition: all .5s
        }

        a.p-link {
            text-decoration: underline
        }

        a:visited,
        a:focus {
            color: inherit
        }

        p a {
            color: #D30815;
            text-decoration: underline
        }

        a:hover,
        button.btn-std:hover {
            color: #222
        }

        img {
            max-width: 100%;
            height: auto
        }

        button,
        [type='button'],
        [type='reset'],
        [type='submit'],
        [type='color'],
        [type='date'],
        [type='datetime'],
        [type='datetime-local'],
        [type='email'],
        [type='month'],
        [type='number'],
        [type='password'],
        [type='search'],
        [type='tel'],
        [type='text'],
        [type='time'],
        [type='url'],
        [type='week'],
        input:not([type]),
        textarea {
            vertical-align: middle;
            appearance: none;
            background: none;
            outline: none;
            border: none;
            cursor: pointer;
            padding: 0;
            color: #333;
            font-size: 100%;
            font-family: inherit;
            font-weight: inherit;
            border-radius: 0;
            transition: all .5s
        }

        button[name="retour-btn"] {
            font-weight: 600;
            font-size: 95%;
            margin-bottom: 15px;
            padding: 5px 0;
            color: #666
        }

        button[name="retour-btn"] i {
            margin-right: 5px
        }

        @media screen and (min-width: 1200px) {
            button[name="retour-btn"] {
                display: none
            }
        }

        [type='color'],
        [type='date'],
        [type='datetime'],
        [type='datetime-local'],
        [type='email'],
        [type='month'],
        [type='number'],
        [type='password'],
        [type='search'],
        [type='tel'],
        [type='text'],
        [type='time'],
        [type='url'],
        [type='week'],
        input:not([type]),
        textarea {
            border: 1px solid #333;
            padding: 5px 10px;
            cursor: auto
        }

        .bold {
            font-weight: 700
        }

        .ft-caps {
            text-transform: uppercase
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            margin: 0;
            text-transform: uppercase;
            font-family: "Kanit", sans-serif;
            font-weight: 700
        }

        h1 {
            font-size: 125%;
            margin-bottom: 25px;
            max-width: 90%;
            font-weight: 600
        }

        h1 span.smaller {
            display: block;
            padding: 10px 0 0px 0;
            font-size: 80%;
            line-height: 1.2
        }

        @media screen and (min-width: 768px) {
            h1 {
                margin-bottom: 50px;
                max-width: 100%
            }
        }

        @media screen and (min-width: 1000px) {
            h1 span.smaller {
                font-size: 68%;
                line-height: 1.1;
                padding-top: 0
            }
        }

        h1.h-cart {
            position: relative;
            color: white;
            padding: .6em 1em .6em 0;
            display: inline-block;
            line-height: 1;
            max-width: 95%
        }

        h1.h-cart:before {
            content: '';
            display: block;
            top: 0;
            right: 0;
            bottom: 0;
            left: -20px;
            position: absolute;
            z-index: -1;
            background-color: inherit
        }

        @media screen and (min-width: 768px) {
            h1.h-cart {
                padding: .4em .8em .4em 0
            }
        }

        @media screen and (min-width: 1000px) {
            h1.h-cart:before {
                left: -30px
            }
        }

        @media screen and (min-width: 1200px) {
            h1.h-cart:before {
                left: -2000px
            }
        }

        h2 {
            font-size: 125%;
            margin-bottom: 20px;
            border-bottom: 1px solid #333;
            padding-bottom: 5px;
            padding-top: 3%;
            line-height: 1
        }

        h2.smaller {
            padding-top: 0
        }

        h2+p {
            margin-top: -5px
        }

        @media screen and (min-width: 768px) {
            h2+p {
                margin-top: -15px
            }
        }

        @media screen and (min-width: 768px) {
            h2+h3 {
                margin-top: 40px
            }
        }

        h3 {
            font-size: 115%;
            margin-bottom: 12px
        }

        h4 {
            font-size: 85%;
            margin-bottom: 15px
        }

        @media screen and (min-width: 768px) {

            h1,
            h2 {
                font-size: 162.5%
            }

            h2 {
                margin-bottom: 30px
            }

            h3 {
                font-size: 138%;
                margin-bottom: 15px
            }

            h4 {
                font-size: 95%
            }
        }

        @media screen and (min-width: 1000px) {

            h1,
            h2 {
                font-size: 187.5%
            }

            h2.smaller {
                font-size: 150%
            }

            h3 {
                font-size: 149.5%
            }
        }

        @media screen and (min-width: 1200px) {

            h1,
            h2 {
                font-size: 218.75%
            }
        }

        p {
            line-height: 1.6;
            margin: 0px auto 20px auto
        }

        @media screen and (max-width: 767px) {
            p {
                font-size: 95%;
                margin: 0px auto 10px auto;
                line-height: 1.4
            }
        }

        p:last-of-type {
            margin-bottom: 0
        }

        p+h3 {
            margin-top: 20px
        }

        @media screen and (min-width: 768px) {
            p+h3 {
                margin-top: 30px
            }
        }

        p.intro-text {
            font-style: italic;
            color: #999;
            line-height: 1.5;
            margin-bottom: 20px
        }

        @media screen and (min-width: 768px) {
            p.intro-text {
                font-size: 120%;
                margin-bottom: 40px
            }
        }

        .algn-c {
            text-align: center
        }

        .algn-j {
            text-align: justify
        }

        .clearfix::after {
            clear: both;
            content: "";
            display: block
        }

        .clearfix::before {
            clear: both;
            content: "";
            display: block
        }

        .clr-white {
            color: white
        }

        .clr-brand {
            color: #D30815
        }

        .clr-brand-bg {
            background-color: #D30815
        }

        .clr-brand-2 {
            color: #F5960F
        }

        .clr-brand-2-bg {
            background-color: #F5960F
        }

        body>header,
        section.base,
        footer,
        .breadcrumb,
        .back {
            padding-left: 20px;
            padding-right: 20px
        }

        @media screen and (min-width: 1000px) {

            body>header,
            section.base,
            footer,
            .breadcrumb,
            .back {
                padding-left: 30px;
                padding-right: 30px
            }
        }

        section {
            position: relative
        }

        section.base {
            padding-top: 40px;
            padding-bottom: 40px
        }

        section.base:first-of-type {
            padding-top: 5px
        }

        @media screen and (min-width: 768px) {
            section.base {
                padding-top: 50px;
                padding-bottom: 50px
            }

            section.base:first-of-type {
                padding-top: 40px
            }
        }

        @media screen and (min-width: 1000px) {
            section.base {
                padding-top: 50px;
                padding-bottom: 50px
            }

            section.base:first-of-type {
                padding-top: 50px
            }
        }

        section.base-2 {
            padding-bottom: 30px
        }

        @media screen and (min-width: 1000px) {
            section.base-2 {
                padding-bottom: 40px
            }
        }

        section.base-2:last-of-type {
            padding-bottom: 0px
        }

        .main-max-width {
            max-width: 1168px;
            margin: 0 auto
        }

        .mrgn-b-10 {
            margin-bottom: 10px
        }

        .semi-bold {
            font-weight: 600
        }

        .breadcrumb {
            display: none
        }

        .breadcrumb li:before,
        .breadcrumb a:before {
            margin: 0;
            width: auto;
            color: #999;
            vertical-align: bottom
        }

        .breadcrumb li {
            display: inline-block;
            margin-right: 7px
        }

        .breadcrumb li:not(:first-of-type) {
            font-size: 65%
        }

        .breadcrumb li:not(:first-of-type):before {
            margin-right: 10px;
            vertical-align: baseline;
            font-size: 13px
        }

        @media screen and (min-width: 768px) {
            .breadcrumb {
                display: block
            }
        }

        @media screen and (min-width: 768px) {
            nav.back {
                display: none
            }
        }

        .video-cont {
            margin: 0 auto;
            max-width: 770px;
            margin-bottom: 20px
        }

        @media screen and (min-width: 768px) {
            .video-cont {
                margin-bottom: 30px
            }
        }

        .video-cont:last-of-type {
            margin-bottom: 0
        }

        .responsive-video {
            overflow: hidden;
            padding-bottom: 56.25%;
            position: relative;
            height: 0;
            background: black
        }

        .responsive-video iframe {
            left: 0;
            top: 0;
            height: 100%;
            width: 100%;
            position: absolute;
            margin: 0
        }

        .swiper-container {
            position: relative;
            overflow: hidden
        }

        .swiper-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            z-index: 1;
            display: -webkit-box;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-sizing: content-box;
            box-sizing: content-box
        }

        .swiper-slide {
            -webkit-flex-shrink: 0;
            -ms-flex-negative: 0;
            flex-shrink: 0;
            width: 100%;
            height: 100%;
            position: relative
        }

        .lazyload,
        .lazyloading {
            opacity: 0
        }

        .lazyloaded {
            opacity: 1;
            transition: opacity .5s
        }

        .udf-hidden {
            visibility: hidden;
            opacity: 0;
            transition: opacity .5s;
            transition-delay: .5s
        }

        [class^="icon-"]:before,
        [class*=" icon-"]:before {
            font-family: "fontello";
            font-style: normal;
            font-weight: normal;
            speak: none;
            display: inline-block;
            text-decoration: inherit;
            width: 1em;
            margin-right: .2em;
            text-align: center;
            font-variant: normal;
            text-transform: none;
            line-height: 1em;
            margin-left: .2em;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale
        }

        .icon-youtube-play {
            color: #e05f5f
        }

        .icon-linkedin-rect {
            color: #0077B5
        }

        .icon-location:before {
            content: '\e800'
        }

        .icon-loupe:before {
            content: '\e801'
        }

        .icon-mail:before {
            content: '\e802'
        }

        .icon-phone-1:before {
            content: '\e803'
        }

        .icon-close:before {
            content: '\e804'
        }

        .icon-arrow-right:before {
            content: '\e805'
        }

        .icon-menu:before {
            content: '\e806'
        }

        .icon-round-arrow-left:before {
            content: '\e807'
        }

        .icon-round-arrow-right:before {
            content: '\e808'
        }

        .icon-round-arrow-down:before {
            content: '\e809'
        }

        .icon-round-arrow-up:before {
            content: '\e80a'
        }

        .icon-ok:before {
            content: '\e80b'
        }

        .icon-arrow-down:before {
            content: '\e80c'
        }

        .icon-arrow-left:before {
            content: '\e80d'
        }

        .icon-arrow-up:before {
            content: '\e80e'
        }

        .icon-home:before {
            content: '\e80f'
        }

        .icon-fl-r:before {
            content: '\e810'
        }

        .icon-fl-l:before {
            content: '\e811'
        }

        .icon-file:before {
            content: '\e812'
        }

        .icon-pdf:before {
            content: '\e813'
        }

        .icon-down-open:before {
            content: '\f004'
        }

        .icon-up-open:before {
            content: '\f005'
        }

        .icon-right-open:before {
            content: '\f006'
        }

        .icon-left-open:before {
            content: '\f007'
        }

        .icon-youtube-play:before {
            content: '\f16a'
        }

        .icon-fax:before {
            content: '\f1ac'
        }

        .icon-facebook-official:before {
            content: '\f230'
        }

        .icon-linkedin-rect:before {
            content: '\f312'
        }

        body>header {
            padding-top: 20px;
            padding-bottom: 0px;
            position: fixed;
            width: 100%;
            z-index: 100;
            top: 0;
            background: rgba(255, 255, 255, 0.8);
            -webkit-backdrop-filter: blur(7px)
        }

        body>header a.logo {
            display: inline-block;
            margin-bottom: 10px;
            position: relative;
            z-index: 2
        }

        body>header a.logo img {
            width: 131.56px
        }

        @media screen and (min-width: 768px) {
            body>header a.logo img {
                width: 173.58px
            }
        }

        @media screen and (min-width: 1200px) {
            body>header a.logo img {
                width: 220px;
                height: 83px
            }
        }

        body>header [name="burger-btn"] {
            float: right;
            margin-top: 8px;
            width: 45px;
            color: #999
        }

        @media screen and (min-width: 768px) {
            body>header [name="burger-btn"] {
                width: 65px;
                font-size: 20px
            }
        }

        @media screen and (max-width: 1199px) {
            body>header nav {
                position: absolute;
                top: 0;
                right: 0;
                width: 100%;
                max-width: 500px;
                height: 100vh;
                overflow-y: auto;
                overflow-x: hidden;
                transform: translateX(100%);
                background: white;
                padding: 40px 20px;
                transition: transform .5s;
                -webkit-overflow-scrolling: touch;
                z-index: 3
            }

            body>header nav [name="close-btn"] {
                position: absolute;
                top: 40px;
                right: 25px;
                color: #999;
                font-size: 20px;
                z-index: 300
            }
        }

        @media screen and (min-width: 1200px) {
            body>header nav {
                transition: none
            }
        }

        body>header nav .lang-menu {
            position: relative;
            display: inline-block;
            font-size: 75%;
            z-index: 100;
            text-transform: uppercase;
            margin-bottom: 25px;
            color: #666;
            min-width: 110px
        }

        body>header nav .lang-menu button,
        body>header nav .lang-menu>ul {
            border: 1px solid #a3a3a3
        }

        body>header nav .lang-menu button {
            background: white;
            padding: 5px 10px 5px 10px;
            position: relative;
            text-transform: uppercase;
            width: 100%;
            text-align: right
        }

        body>header nav .lang-menu>ul {
            visibility: hidden;
            text-align: right;
            opacity: 0;
            position: absolute;
            top: 100%;
            left: 0;
            width: 100%;
            background: white;
            transform: translateY(-2em);
            z-index: -1;
            margin-top: -1px;
            transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s
        }

        body>header nav .lang-menu>ul a {
            display: inline-block;
            padding: 10px
        }

        body>header nav .lang-menu>ul a span {
            margin-left: 0px;
            opacity: 0;
            color: #F5960F
        }

        body>header nav .lang-menu>ul a.current span {
            opacity: 1
        }

        body>header nav .lang-menu:focus>ul,
        body>header nav .lang-menu:hover>ul {
            background: white;
            visibility: visible;
            opacity: 1;
            z-index: 1;
            transform: translateY(0%);
            transition-delay: 0s, 0s, 0.3s
        }

        @media screen and (min-width: 1200px) {
            body>header nav .lang-menu {
                min-width: 90px
            }
        }

        body>header nav form.search {
            margin-bottom: 10px;
            color: #666
        }

        body>header nav form.search input {
            border: none;
            border-bottom: 1px solid #333;
            width: 0;
            padding: 0 0 2px 0;
            opacity: 0;
            margin-left: 0px;
            transition: all .5s
        }

        body>header nav form.search button {
            cursor: default
        }

        body>header nav form.search:hover input {
            width: 226px;
            opacity: 1;
            margin-left: 5px
        }

        body>header nav form.search input:focus {
            width: 226px;
            opacity: 1;
            margin-left: 5px
        }

        @media screen and (max-width: 1199px) {
            body>header nav>ul {
                width: 100%;
                font-size: 80%;
                color: #999;
                font-weight: 600
            }

            body>header nav>ul a {
                display: block;
                padding: 12px 0
            }

            body>header nav>ul a span {
                float: right;
                font-size: 16px;
                margin-top: -2px
            }

            body>header nav>ul>li .maximenu {
                position: absolute;
                top: 0;
                right: 0;
                width: 100%;
                bottom: 0;
                background: white;
                padding: 40px 20px;
                overflow-y: auto;
                transform: translateX(100%);
                transition: transform .5s;
                z-index: 200
            }

            body>header nav>ul>li .maximenu [name="retour-btn"] {
                margin-bottom: 40px;
                font-size: 115%
            }

            body>header nav>ul>li .maximenu.opened {
                transform: translateX(0%)
            }

            body>header nav>ul>li .maximenu ul li.title {
                color: #333;
                margin-bottom: 12px
            }
        }

        @media screen and (max-width: 1199px) {
            body>header.nav-opened nav {
                transition: transform .5s;
                transform: translateX(0%);
                box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3)
            }
        }

        @media screen and (min-width: 1200px) {
            body>header {
                background: none;
                position: relative
            }

            body>header [name="burger-btn"],
            body>header [name="close-btn"],
            body>header [name="arrow-right-light"],
            body>header li.title,
            body>header [name="retour-btn"] {
                display: none
            }

            body>header nav .item-cont {
                position: absolute;
                top: 40px;
                left: 30px;
                right: 30px
            }

            body>header nav .lang-menu,
            body>header nav form.search {
                float: right;
                margin-bottom: 0;
                margin-left: 35px
            }

            body>header nav .lang-menu {
                font-size: 60%
            }

            body>header nav .lang-menu button {
                padding: 5px 10px 5px 15px
            }

            body>header nav>ul {
                text-align: justify;
                height: 40px
            }

            body>header nav>ul:after {
                content: '';
                display: inline-block;
                width: 100%
            }

            body>header nav>ul>li {
                display: inline-block;
                vertical-align: top
            }

            body>header nav>ul>li>a {
                font-size: 90%;
                display: inline-block;
                position: relative;
                padding-bottom: 5px;
                border-bottom: 5px solid transparent;
                color: #666
            }

            body>header nav>ul>li .maximenu {
                position: absolute;
                right: 0;
                left: 0;
                overflow: hidden;
                visibility: hidden;
                transition-delay: .5s
            }

            body>header nav>ul>li .maximenu .container {
                transform: translateY(-100%);
                transition: transform .5s;
                background: #D30815;
                background-image: url(okle/images/bg-maximenu_ecosafe.png), linear-gradient(45deg, #e00817 40%, #eb441d 60%, #fc0 80%);
                background-repeat: no-repeat;
                background-position: center center, left top;
                color: white;
                padding: 15px 0;
                font-size: 75%;
                font-weight: 600;
                text-align: left
            }

            body>header nav>ul>li .maximenu ul {
                -moz-column-count: 4;
                -webkit-column-count: 4;
                column-count: 4;
                column-fill: balance;
                max-height: 190px
            }

            body>header nav>ul>li .maximenu ul li {
                padding: 10px 20px 10px 10px;
                line-height: 1.5;
                display: inline-block;
                width: 100%
            }

            body>header nav>ul>li .maximenu ul li.title {
                display: none
            }

            body>header nav>ul>li .maximenu ul li a {
                border-bottom: 1px solid transparent
            }

            body>header nav>ul>li .maximenu ul li a:hover {
                color: inherit;
                border-bottom: 1px solid white
            }

            body>header nav>ul>li:hover>a {
                border-bottom: 5px solid #D30815
            }

            body>header nav>ul>li:hover .maximenu {
                visibility: visible;
                transition-delay: .0s
            }

            body>header nav>ul>li:hover .maximenu .container {
                transform: translateY(0%)
            }
        }